<template>
  <van-action-sheet
    z-index="100"
    :show="contactStore.visible"
    :actions="actionsList"
    cancel-text="取消"
    @select="selectItem"
    @cancel="closePop"
    @click-overlay="closePop"
  />
</template>
<script lang="ts" setup>
import { computed, ref, reactive, toRefs, watch, onMounted, onUnmounted, nextTick } from 'vue'
import { storeToRefs } from 'pinia'
import { useContactStore } from '@/store'
import { useRouter, useRoute } from 'vue-router'
import type { IContactItem } from './type'
import md5 from 'md5'
import { getVideoUrl } from '@/utils/index'

defineOptions({
  name: 'ContactPop'
})

const route = useRoute()
const router = useRouter()

interface IState {
  actions: IContactItem[]
}

const props = defineProps({
  
})

const contactStore = useContactStore()
const { contactUserInfo, actionsList,anomalyIndex } = storeToRefs(contactStore)

const initial = computed(() => {
  if (contactUserInfo.value.realName) return contactUserInfo.value.realName.slice(0, 1)
  return ''
})

const state = reactive<IState>({
  actions: [
    {
      name: '发消息',
    },
    {
      name: '打电话',
    },
    {
      name: '视频会议',
    },
  ],
})

const selectItem = (item: any) => {
  closePop()
  if(item.name == '发消息'){
    handleSendClick()
  }
  if(item.name == '打电话'){
    handleCallClick()
  }
  if(item.name == '视频会议'){
    handleMeeting()
  }
}

//发消息
const handleSendClick = () => {
  let query = {
    id: contactUserInfo.value.id,
    initial: initial.value
  }
  if(anomalyIndex.value){
    query.anomalyTips = anomalyIndex.value + "预警，请关注"
  }
  router.push({
    path: '/contact/talk',
    query
  })
}

//打电话
const handleCallClick = () => {
  if (contactUserInfo.value.mobile){
    window.location.href = 'tel://' + contactUserInfo.value.mobile;
  }
}

//视频会议
const handleMeeting = () => {
  const url = getVideoUrl();
  window.open(url, '_blank')
}

const closePop = () => {
  contactStore.changeVisible(false)
}

</script>

<style lang="less" scoped>
</style>